<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!doctype html>
<html class="no-js" lang="en">

<head>
    <jsp:include page="../commons/top.jsp"/>
    <title>咙咚锵购物商城</title>

</head>

<body>

<!--头部区域开始-->
    <jsp:include page="../commons/head.jsp"/>
<!--头部区域结束-->

<!--滑块区域开始-->
<section class="slider_section slider_s_two mb-60 mt-20">
    <div class="container">
        <div class="row">
            <div class="col-lg-9 offset-lg-3 col-md-12">
                <div class="swiper-container gallery-top">
                    <div class="slider_area swiper-wrapper">
                        <div class="single_slider swiper-slide d-flex align-items-center" data-bgimg="${pageContext.request.contextPath}/static/front/img/slider/slider5.jpg">
                            <div class="slider_content">
                                <h3>新品集合</h3>
                                <h1>新品集合<br> 男士运动装</h1>
                                <a class="button" href="${pageContext.request.contextPath}/index/system_detailed">立刻查看</a>
                            </div>
                        </div>
                        <div class="single_slider swiper-slide d-flex align-items-center" data-bgimg="${pageContext.request.contextPath}/static/front/img/slider/slider6.jpg">
                            <div class="slider_content">
                                <h3>新品集合</h3>
                                <h1>现代简约风 <br> 2019新款</h1>
                                <a class="button" href="shop.html">立刻查看</a>
                            </div>
                        </div>
                        <div class="single_slider swiper-slide d-flex align-items-center" data-bgimg="${pageContext.request.contextPath}/static/front/img/slider/slider7.jpg">
                            <div class="slider_content color_white">
                                <h3>新品集合</h3>
                                <h1>现代简约风 <br> 2019新款</h1>
                                <a class="button" href="shop.html">立刻查看</a>
                            </div>
                        </div>
                        <div class="single_slider swiper-slide d-flex align-items-center" data-bgimg="${pageContext.request.contextPath}/static/front/img/slider/slider8.jpg">
                            <div class="slider_content">
                                <h3>新品集合</h3>
                                <h1>现代简约风 <br> 2019新款</h1>
                                <a class="button" href="shop.html">立刻查看</a>
                            </div>
                        </div>
                    </div>
                    <!-- 添加箭头 -->

                    <div class="swiper-pagination"></div>
                </div>
                <div class="swiper-container gallery-thumbs">
                    <div class="swiper-wrapper">
                        <div class="swiper-slide">
                            新上市运动款男装
                        </div>
                        <div class="swiper-slide">
                            <a href="#"></a>
                            2019现代简约风椅子
                        </div>
                        <div class="swiper-slide">
                            2019现代简约风椅子
                        </div>
                        <div class="swiper-slide">
                            2019现代简约风椅子
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </div>
</section>
<!--滑块区域结束-->

<!--首页区域bg区开始-->
<div class="home_section_bg">

    <!--商品特惠区-->
    <div class="product_area deals_product_style2">
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <div class="product_header">
                        <div class="section_title">
                            <h2>特惠商品</h2>

                        </div>
                    </div>
                </div>
            </div>
            <div class="tab-content">
                <div class="tab-pane fade show active" id="Fashion" role="tabpanel">
                    <div class="product_carousel product_style product_column2 owl-carousel">
                        <c:forEach var="goodsDiscounts" items="${goodsDiscounts}">
                            <article class="single_product">
                                <figure>
                                    <div class="product_thumb">
                                        <a class="primary_img" href="${pageContext.servletContext.contextPath}/index/system_countdown/${goodsDiscounts.goodsId}"><img src="${pageContext.servletContext.contextPath}/images/${goodsDiscounts.image1}" alt="" target="_blank"></a>
                                        <a class="secondary_img" href="${pageContext.servletContext.contextPath}/index/system_countdown/${goodsDiscounts.goodsId}"><img src="${pageContext.servletContext.contextPath}/images/${goodsDiscounts.image2}" alt="" target="_blank"></a>
                                    </div>
                                    <div class="product_content">
                                        <div class="product_content_inner">
                                            <h4 class="product_name"><a href="${pageContext.servletContext.contextPath}/index/system_countdown/${goodsDiscounts.goodsId}" target="_blank">${goodsDiscounts.goodsName}</a></h4>
                                            <div class="product_rating">
                                            </div>
                                            <div class="price_box">
                                                <c:forEach var="gs" items="${goodsDiscounts.specs}">
                                                    <span class="current_price">￥${gs.specsPrice}</span>
                                                </c:forEach>
                                            </div>
                                            <div class="countdown_text">
                                                <p><span>快来抢购!</span> 时间有限:</p>
                                            </div>
                                            <div class="product_timing">
                                                <div data-countdown="${goodsDiscounts.discountsdate}"></div>
                                            </div>
                                        </div>
                                    </div>
                                </figure>
                            </article>
                        </c:forEach>
                    </div>
                </div>
            </div>

        </div>
    </div>
    <!--产品特惠结束-->

    <!--热销商品结束-->
    <div class="product_area">
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <div class="product_header">
                        <div class="section_title">
                            <h2>新品热销</h2>

                        </div>
                    </div>
                </div>
            </div>
            <div class="tab-content">
                <div class="tab-pane fade show active" id="Computer" role="tabpanel">
                    <div class="product_carousel product_style product_column5 owl-carousel">
                        <c:forEach var="goodsList" items="${goodsList}">
                            <article class="single_product">
                                <figure>
                                    <div class="product_thumb">
                                        <a class="primary_img" href="${pageContext.servletContext.contextPath}/index/system_detailed/${goodsList.goodsId}" target="_blank"><img src="${pageContext.request.contextPath}/images/${goodsList.image1}" alt=""></a>
                                        <a class="secondary_img" href="${pageContext.servletContext.contextPath}/index/system_detailed/${goodsList.goodsId}" target="_blank"><img src="${pageContext.request.contextPath}/images/${goodsList.image2}" alt=""></a>
                                        <div class="label_product">
                                            <span class="label_sale">新品</span>
                                        </div>
                                        <div class="action_links">
                                        </div>
                                    </div>
                                    <div class="product_content">
                                        <div class="product_content_inner">
                                            <h4 class="product_name"><a href="${pageContext.servletContext.contextPath}/index/system_detailed/${goodsList.goodsId}" target="_blank">${goodsList.goodsName}</a></h4>
                                            <div class="price_box">
                                                <c:forEach var="gs" items="${goodsList.specs}">
                                                    <span class="current_price">￥${gs.specsPrice}</span>
                                                </c:forEach>
                                            </div>
                                        </div>
                                        <div class="add_to_cart">
                                            <a href="cart.html" title="添加到购物车">添加到购物车</a>
                                        </div>
                                    </div>
                                </figure>
                            </article>
                        </c:forEach>
                    </div>
                </div>
            </div>

        </div>
    </div>
    <!--热销商品结束-->

    <!--商品推荐开始-->
    <div class="small_product_area mb-55">
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <div class="product_header">
                        <div class="section_title">
                            <h2>推荐商品</h2>

                        </div>
                    </div>
                </div>
            </div>
            <div class="tab-content">
                <div class="tab-pane fade show active" id="Fashion2" role="tabpanel">
                    <div class="product_carousel small_p_container  small_product_column3 owl-carousel">
                        <div class="product_items">
                            <figure class="single_product">
                                <div class="product_thumb">
                                    <a class="primary_img" href="product-details.html"><img src="${pageContext.request.contextPath}/static/front/img/product/product5.jpg" alt=""></a>
                                    <a class="secondary_img" href="product-details.html"><img src="${pageContext.request.contextPath}/static/front/img/product/product6.jpg" alt=""></a>
                                </div>
                                <div class="product_content">
                                    <h4 class="product_name"><a href="product-details.html">肾宝味道好极了</a></h4>
                                    <div class="product_rating">
                                    </div>
                                    <div class="price_box">
                                        <span class="old_price">$76.00</span>
                                        <span class="current_price">$72.00</span>
                                    </div>
                                    <div class="product_cart_button">
                                        <a href="cart.html" title="添加到购物车"><i class="fa fa-shopping-bag"></i></a>
                                    </div>

                                </div>
                            </figure>
                            <figure class="single_product">
                                <div class="product_thumb">
                                    <a class="primary_img" href="product-details.html"><img src="${pageContext.request.contextPath}/static/front/img/product/product7.jpg" alt=""></a>
                                    <a class="secondary_img" href="product-details.html"><img src="${pageContext.request.contextPath}/static/front/img/product/product8.jpg" alt=""></a>
                                </div>
                                <div class="product_content">
                                    <h4 class="product_name"><a href="product-details.html">肾宝味道好极了</a></h4>
                                    <div class="product_rating">
                                    </div>
                                    <div class="price_box">
                                        <span class="old_price">$65.00</span>
                                        <span class="current_price">$60.00</span>
                                    </div>
                                    <div class="product_cart_button">
                                        <a href="cart.html" title="添加到购物车"><i class="fa fa-shopping-bag"></i></a>
                                    </div>

                                </div>
                            </figure>
                        </div>
                        <div class="product_items">
                            <figure class="single_product">
                                <div class="product_thumb">
                                    <a class="primary_img" href="product-details.html"><img src="${pageContext.request.contextPath}/static/front/img/product/product9.jpg" alt=""></a>
                                    <a class="secondary_img" href="product-details.html"><img src="${pageContext.request.contextPath}/static/front/img/product/product10.jpg" alt=""></a>
                                </div>
                                <div class="product_content">
                                    <h4 class="product_name"><a href="product-details.html">肾宝味道好极了</a></h4>
                                    <div class="product_rating">
                                    </div>
                                    <div class="price_box">
                                        <span class="old_price">$82.00</span>
                                        <span class="current_price">$78.00</span>
                                    </div>
                                    <div class="product_cart_button">
                                        <a href="cart.html" title="添加到购物车"><i class="fa fa-shopping-bag"></i></a>
                                    </div>

                                </div>
                            </figure>
                            <figure class="single_product">
                                <div class="product_thumb">
                                    <a class="primary_img" href="product-details.html"><img src="${pageContext.request.contextPath}/static/front/img/product/product11.jpg" alt=""></a>
                                    <a class="secondary_img" href="product-details.html"><img src="${pageContext.request.contextPath}/static/front/img/product/product12.jpg" alt=""></a>
                                </div>
                                <div class="product_content">
                                    <h4 class="product_name"><a href="product-details.html">肾宝味道好极了</a></h4>
                                    <div class="product_rating">
                                    </div>
                                    <div class="price_box">
                                        <span class="old_price">$72.00</span>
                                        <span class="current_price">$68.00</span>
                                    </div>
                                    <div class="product_cart_button">
                                        <a href="cart.html" title="添加到购物车"><i class="fa fa-shopping-bag"></i></a>
                                    </div>

                                </div>
                            </figure>
                        </div>
                        <div class="product_items">
                            <figure class="single_product">
                                <div class="product_thumb">
                                    <a class="primary_img" href="product-details.html"><img src="${pageContext.request.contextPath}/static/front/img/product/product9.jpg" alt=""></a>
                                    <a class="secondary_img" href="product-details.html"><img src="${pageContext.request.contextPath}/static/front/img/product/product10.jpg" alt=""></a>
                                </div>
                                <div class="product_content">
                                    <h4 class="product_name"><a href="product-details.html">肾宝味道好极了</a></h4>
                                    <div class="product_rating">
                                    </div>
                                    <div class="price_box">
                                        <span class="old_price">$82.00</span>
                                        <span class="current_price">$78.00</span>
                                    </div>
                                    <div class="product_cart_button">
                                        <a href="cart.html" title="添加到购物车"><i class="fa fa-shopping-bag"></i></a>
                                    </div>

                                </div>
                            </figure>
                            <figure class="single_product">
                                <div class="product_thumb">
                                    <a class="primary_img" href="product-details.html"><img src="${pageContext.request.contextPath}/static/front/img/product/product11.jpg" alt=""></a>
                                    <a class="secondary_img" href="product-details.html"><img src="${pageContext.request.contextPath}/static/front/img/product/product12.jpg" alt=""></a>
                                </div>
                                <div class="product_content">
                                    <h4 class="product_name"><a href="product-details.html">肾宝味道好极了</a></h4>
                                    <div class="product_rating">
                                    </div>
                                    <div class="price_box">
                                        <span class="old_price">$72.00</span>
                                        <span class="current_price">$68.00</span>
                                    </div>
                                    <div class="product_cart_button">
                                        <a href="cart.html" title="添加到购物车"><i class="fa fa-shopping-bag"></i></a>
                                    </div>

                                </div>
                            </figure>
                        </div>
                        <div class="product_items">
                            <figure class="single_product">
                                <div class="product_thumb">
                                    <a class="primary_img" href="product-details.html"><img src="${pageContext.request.contextPath}/static/front/img/product/product13.jpg" alt=""></a>
                                    <a class="secondary_img" href="product-details.html"><img src="${pageContext.request.contextPath}/static/front/img/product/product14.jpg" alt=""></a>
                                </div>
                                <div class="product_content">
                                    <h4 class="product_name"><a href="product-details.html">肾宝味道好极了</a></h4>
                                    <div class="product_rating">
                                    </div>
                                    <div class="price_box">
                                        <span class="old_price">$86.00</span>
                                        <span class="current_price">$79.00</span>
                                    </div>
                                    <div class="product_cart_button">
                                        <a href="cart.html" title="添加到购物车"><i class="fa fa-shopping-bag"></i></a>
                                    </div>

                                </div>
                            </figure>
                            <figure class="single_product">
                                <div class="product_thumb">
                                    <a class="primary_img" href="product-details.html"><img src="${pageContext.request.contextPath}/static/front/img/product/product17.jpg" alt=""></a>
                                    <a class="secondary_img" href="product-details.html"><img src="${pageContext.request.contextPath}/static/front/img/product/product18.jpg" alt=""></a>
                                </div>
                                <div class="product_content">
                                    <h4 class="product_name"><a href="product-details.html">肾宝味道好极了</a></h4>
                                    <div class="product_rating">
                                    </div>
                                    <div class="price_box">
                                        <span class="old_price">$75.00</span>
                                        <span class="current_price">$70.00</span>
                                    </div>
                                    <div class="product_cart_button">
                                        <a href="cart.html" title="添加到购物车"><i class="fa fa-shopping-bag"></i></a>
                                    </div>

                                </div>
                            </figure>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </div>
    <!--商品推荐结束-->

    <!--商品推荐结束-->
    <div class="product_area">
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <div class="product_header">
                        <div class="section_title">
                            <h2>热门推荐</h2>

                        </div>
                    </div>
                </div>
            </div>
            <div class="tab-content">
                <div class="tab-pane fade show active" role="tabpanel">
                    <div class="product_carousel product_style product_column5 owl-carousel">
                        <c:forEach var="goodsRecommend" items="${goodsRecommend}">
                            <article class="single_product">
                                <figure>
                                    <div class="product_thumb">
                                        <a class="primary_img" href="${pageContext.servletContext.contextPath}/index/system_detailed/${goodsRecommend.goodsId}" target="_blank"><img src="${pageContext.request.contextPath}/images/${goodsRecommend.image1}" alt=""></a>
                                        <a class="secondary_img" href="${pageContext.servletContext.contextPath}/index/system_detailed/${goodsRecommend.goodsId}" target="_blank"><img src="${pageContext.request.contextPath}/images/${goodsRecommend.image2}" alt=""></a>
                                        <div class="label_product">
                                            <span class="label_sale">热推</span>
                                        </div>
                                        <div class="action_links">
                                        </div>
                                    </div>
                                    <div class="product_content">
                                        <div class="product_content_inner">
                                            <h4 class="product_name"><a href="${pageContext.servletContext.contextPath}/index/system_detailed/${goodsRecommend.goodsId}" target="_blank">${goodsRecommend.goodsName}</a></h4>
                                            <div class="price_box">
                                                <c:forEach var="gs" items="${goodsRecommend.specs}">
                                                    <span class="current_price">￥${gs.specsPrice}</span>
                                                </c:forEach>
                                            </div>
                                        </div>
                                        <div class="add_to_cart">
                                            <a href="cart.html" title="添加到购物车">添加到购物车</a>
                                        </div>
                                    </div>
                                </figure>
                            </article>
                        </c:forEach>
                    </div>
                </div>
            </div>

        </div>
    </div>
    <!--商品推荐结束-->

</div>
<!--首页部分bg区域结束-->

<!--footer area start-->
<jsp:include page="../commons/bottom.jsp"/>
<!--footer area end-->

</body>

</html>
